<meta charset="UTF-8">
<script src="jquery-3.2.1.js"></script>
<style>
    li{
        list-style:none;
    }
</style>
<ul>
    <li><span>-</span> <input value="1" /> <span>+</span></li>
    <li><span>-</span> <input value="1" /> <span>+</span></li>
    <li><span>-</span> <input value="1" /> <span>+</span></li>
</ul>
<script>
    //dom对象
    //jquery对象
    //jquery对象是对dom对象的封装，提供一些非常方便的方法
    //jquery对象可以封装0个或任意个dom对象，其本质是一个数组
    $(
        function(){
            $("li span:first-child").click(
                function(){
                    $(this).next().val(
                        function(index,value){
                            return value-1;
                        }
                    );
                }
            );

            $("li span:last-child").click(
                function(){
                    $(this).prev().val(
                        function(index,value){
                            return parseInt(value)+1;
                        }
                    );
                }
            );
        }
    );
</script>









